<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>盒子模型之边框</title>
		<style>
		
		.box{
			width:100px;
			height:100px;
			argin:10px 10px 10px 10px;}
		}
		.box1{
				
				border:2px dashed red;
			}
		.box2{
			border:4px dotted red;
			}
		.box3{
				border:4px solid red;
				
			}
		.box4{
			border-top:4px dashed red;
			border-left:4px dotted blue;
			border-right:4px solid yellow;
			border-bottom:4px solid  green;
			/*border:宽度 样式 眼色
			 */
			/*dashed:块状虚线
			 * dotted：点状虚线
			 * solid：描边，实线
			 */
			
		</style>
	</head>
	<body>
		<div class="box1 box"></div>
	<div class="box2 box"></div>
	<div class="box3 box"></div>
	<div class="box4 box"></div>
	</body>
</html>
